<template>
    <el-dialog title="报工明细" :close-on-click-modal="false" :visible.sync="visible" class="SHZY-dialog SHZY-dialog_center"
        lock-scroll width="70%">
        <el-row :gutter="15" class="">
            <SHZY-table v-loading="listLoading" :data="list">
                <el-table-column label="报工时间" prop="creatorTime" width="150" align="left">
                    <template slot-scope="scope">{{ scope.row.creatorTime | toDate() }}</template>
                </el-table-column>
                <el-table-column label="作业人员" prop="operatorId" align="left" width="150">
                </el-table-column>
                <el-table-column label="报工数量" prop="qty" align="left" width="100">
                </el-table-column>
                <el-table-column label="不合格数量" prop="ngQty" align="left" width="100">
                </el-table-column>
                <el-table-column label="实际开始时间" prop="actualStartTime" width="150" align="left">
                    <template slot-scope="scope">{{ scope.row.actualStartTime | toDate() }}</template>
                </el-table-column>
                <el-table-column label="实际完成时间" prop="actualEndTime" width="150" align="left">
                    <template slot-scope="scope">{{ scope.row.actualEndTime | toDate() }}</template>
                </el-table-column>
                <el-table-column label="工时（分钟）" prop="workHours" align="left" width="100">
                </el-table-column>
                <el-table-column label="备注" prop="remark" align="left" min-width="150" :show-overflow-tooltip="true">
                </el-table-column>
                <el-table-column label="状态" prop="status" width="150" align="left">
                    <template slot-scope="scope">
                        <el-tag v-if="scope.row.status == 'NG'" type="error">不合格</el-tag>
                        <el-tag v-if="scope.row.status == 'OK'" type="success">合格</el-tag>
                    </template>
                </el-table-column>
                <el-table-column v-if="!readOnly" label="操作" fixed="right" width="100">
                    <template slot-scope="scope">
                        <el-button type="text" @click="handleDel(scope.row.id)" class='SHZY-table-delBtn'>删除</el-button>
                    </template>
                </el-table-column>
            </SHZY-table>
            <pagination :total="total" :page.sync="listQuery.currentPage" :limit.sync="listQuery.pageSize"
                @pagination="initData" />
        </el-row>
        <span slot="footer" class="dialog-footer">
            <el-button @click="visible = false">取 消</el-button>
        </span>
    </el-dialog>
</template>
<script>
import { getWorkreportList, delWorkreport } from '@/api/q1/business/workOrder'
export default {
    components: {},
    props: [],
    data() {

        return {
            btnLoading: false,
            loading: false,
            visible: false,
            readOnly: false,
            id: "",
            list: [],
            listLoading: true,
            total: 0,
            listQuery: {
                currentPage: 1,
                pageSize: 20,
                sort: "desc",
                sidx: "",
            },

        }
    },
    computed: {},
    watch: {},
    created() {

    },
    mounted() {
    },
    methods: {
        goBack() {
            this.$emit('refresh')
        },
        init(id, readOnly) {
            this.id = id || 0;
            this.readOnly = readOnly
            this.list = []
            this.listQuery = {
                currentPage: 1,
                pageSize: 20,
                sort: "desc",
                sidx: "",
            }

            this.visible = true;
            this.$nextTick(() => {
                this.initData()
            });
        },
        initData() {
            this.listLoading = true;
            let query = {
                ...this.listQuery,
                workOrderId: this.id
            };
            getWorkreportList(query).then(res => {
                this.list = res.data.list
                this.total = res.data.pagination.total
                this.listLoading = false
            })
        },
        handleDel(id) {
            this.$confirm('此操作将永久删除该数据, 是否继续?', '提示', {
                type: 'warning'
            }).then(() => {
                delWorkreport(id).then(res => {
                    this.$message({
                        type: 'success',
                        message: res.msg,
                        onClose: () => {
                            this.initData()
                        }
                    });
                })
            }).catch(() => {
            });
        },
    }
}
</script>
